<template>
  <div class="dashboard"> 

  <el-row gutter=20>
        <el-col span="8">
         <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>卡片名称</span>
              <el-button style="float: right;" type="text">操作按钮</el-button>
            </div>
            <div>
              内容列表
              内容列表内容列表内容列表内容列表内容列表内容列表
              内容列表内容列表内容列表

            </div>    
          </el-card>
          
        </el-col>
            

        <el-col span="8">
         <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>卡片名称</span>
              <el-button style="float: right;" type="text">操作按钮</el-button>
            </div>
            <div>
              内容列表
              内容列表内容列表内容列表内容列表内容列表内容列表
              内容列表内容列表内容列表
              
            </div>    
          </el-card>
        </el-col>

         <el-col span="8">
         <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>卡片名称</span>
              <el-button style="float: right;" type="text">操作按钮</el-button>
            </div>
            <div>
              内容列表
              内容列表内容列表内容列表内容列表内容列表内容列表
              内容列表内容列表内容列表
              
            </div>    
          </el-card>
        </el-col>
      </el-row>

      <el-row gutter="20">
        <el-col span="12">
         <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>卡片名称</span>
              <el-button style="float: right;" type="text">操作按钮</el-button>
            </div>
            <div>
              内容列表
              内容列表内容列表内容列表内容列表内容列表内容列表
              内容列表内容列表内容列表

            </div>    
          </el-card>
          
        </el-col>
            

        <el-col span="12">
         <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>卡片名称</span>
              <el-button style="float: right;" type="text">操作按钮</el-button>
            </div>
            <div>
              内容列表
              内容列表内容列表内容列表内容列表内容列表内容列表
              内容列表内容列表内容列表
              
            </div>    
          </el-card>
        </el-col>
      </el-row>



  </div>
</template>

<script>
  export default {
  }
</script>

<style lang="scss">
  .dashboard {
    >.el-row {
      margin-bottom: 20px;
      &:last-child {
        margin-bottom: 0;
      }
    }
    >.el-col {
      border-radius: 4px;
    }
  }
</style>

